<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<title>首页</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="/static/component/pear/css/pear.css" />
		<link rel="stylesheet" href="/static/admin/css/other/console2.css" />
	</head>
	<body class="pear-container">
    <div class="layui-card">
        <div class="layui-card-body" >
            <form class="layui-form" action="" style="text-align: center;">
                <div class="layui-form-item">
                    <div class="layui-form-item layui-inline">
                        <label class="layui-form-label">文件标题</label>
                        <div class="layui-input-inline">
                            <input type="text" id="filename" name="filename" required="required" placeholder=""  class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item layui-inline">
                        <label class="layui-form-label">类型</label>
                        <div class="layui-input-inline">
                            <select id="filetype" lay-verify="" required="required">
                                <option value="">请选择文件类型</option>
                                <option value="1">图片</option>
                                <option value="3">文档</option>
                                <option value="3">招简</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item layui-inline">
                            <button type="button" class="layui-btn layui-btn-normal" id="test4">选择文件</button>
                            <button type="button" class="layui-btn" id="test9" lay-submit lay-filter="filesubmit">开始上传</button>
                    </div>
                    <!--<div class="layui-btn-container">-->
                    <!--    <button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>-->
                    <!--    <button type="button" class="layui-btn" id="test9">开始上传</button>-->
                    <!--</div>-->
                </div>
            </form>
        </div>
    </div>

    <!--<div class="layui-btn-container">-->
    <!--    <button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>-->
    <!--    <button type="button" class="layui-btn" id="test9">开始上传</button>-->
    <!--</div>-->
		<!--</div>-->
		<script src="/static/component/layui/layui.js"></script>
		<script src="/static/component/pear/pear.js"></script>
        <script>
            layui.use(['upload','jquery','form'], function(){
                var upload = layui.upload;
                var $ = layui.$;
                var form = layui.form;
                
              
                    var filetitle = $('#filetitle').val();
                    var filetype  = $("#filetype  option:selected").val();
                    
                 
                        var uploadInst = upload.render({
                            elem: '#test4', //绑定元素
                            accept: 'file',
                            size: 307200,
                            url: '/upload', //上传接口
                            where:{
                                filetitle:filetitle,
                                filetype:filetype
                            },
                            // 不自动上传
                            auto: false,
                            bindAction: '#test9',
                            method: 'POST',
                            before: function () {
                                this.data = {
                                    filetitle: $('input[name="filename"]').val(),
                                    filetype :  $("#filetype  option:selected").val()
                                }
                            },
                            done: function(res){
                                //上传完毕回调
                                layer.alert("上传成功！"+res.msg, {
                                    icon: 5,
                                    title: "提示"
                                });
                                $("#sourcepath").val(res.msg);
            
                            }
                            ,error: function(res){
                                //请求异常回调
                                layer.alert("后台出错", {
                                    icon: 5,
                                    title: "提示"
                                });
                            }
                        });
                    
    
                  
                // 执行实例
                
    
                //选完文件后不自动上传
                // upload.render({
                //     elem: '#test8'
                //     ,url: 'https://httpbin.org/post' //改成您自己的上传接口
                //     //选择文件后不自动上传
                //     ,auto: false
                //     ,multiple: true
                //     //指向一个按钮触发上传
                //     ,bindAction: '#test9'
                //     ,choose: function(obj){
                //         //预读本地文件示例，不支持ie8
                //         obj.preview(function(index, file, result){
                //             $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
                //         });
                //     }
                //     ,done: function(res){
                //         layer.msg('上传成功');
                //         console.log(res)
                //     }
                // });
            });
        </script>
	</body>
</html>
